// 购物车
class Cart{
    constructor(){
        //获取元素
        this.cart_table=$('.cart_table')[0]
        this.tbody=$('tbody')[0]
        this.selectAll=$('.selectAll')[0]
        this.totalNum=$('.totalNum')[0]
        this.money=$('.money')[0]
        // 商品数据
        this.list=JSON.parse(localStorage.getItem('cart'))||[]
        this.init()
    }
    init(){
        this.render()
        this.addEvent()
    }
    render(){
        //判断购物车中有没有商品
        if(!this.list.length){
            $('.cart_table').css('display','none')
            $('.no_cart').css('display','block')
        }else{
            $('.cart_table').css('display','block')
            $('.no_cart').css('display','none')
            // 
            this.tbody.innerHTML=``
            this.list.forEach(item=>{
                this.tbody.innerHTML+=`
                        <tr>
                        <td><input type="checkbox" class="select" data-id="${item.goods_id}" ${item.is_select&&"checked"}></td>
                        <td class="goods_info">
                            <a href="./details.html?id=${item.goods_id}">
                                <img src="${item.img_small_logo}" alt="">
                                <div>${item.title}</div>
                            </a>
                        </td>
                        <td>分类:${item.category}</td>
                        <td>¥:${Math.round(item.price*100)/100}</td>
                        <td>
                            <span class="sub" data-id="${item.goods_id}">-</span>
                            <input type="text" value="${item.cart_number}" class="txt"
                                data-id="${item.goods_id}" />
                            <span class="add" data-id="${item.goods_id}">+</span>
                        </td>
                        <td>
                            <span class="price">¥:${Math.round(item.price*item.cart_number*100)/100}元</span>
                        </td>
                        <td><span class="del" data-id="${item.goods_id}">删除</span></td>
                    </tr>
                `
            })
        }
        // 书数据持续化
        this.total()
        localStorage.setItem('cart',JSON.stringify(this.list))
    }
    addEvent(){
        this.cart_table.addEventListener('click',(e)=>{
            let target=e.target||e.srcElement
            // 做全选
            if(target.className=='selectAll'){
                let type=target.checked
                this.list.forEach(item=>{
                    item.is_select=type
                })
                this.render()
            }
            //做单选
            if(target.className=='select'){
                let id=target.dataset.id-0
                let goods=this.list.find(item=>{
                    return item.goods_id==id
                })
                goods.is_select=!goods.is_select
                this.render()
            }
            // 商品数量的增加
            if(target.className=='add'){
                let id=target.dataset.id-0
                let goods=this.list.find(item=>{
                    return item.goods_id==id
                })
                if(goods.cart_number==10){
                    alert('亲，最多只能买10件哦')
                    return false
                }
                goods.cart_number++
                this.render()
            }
            // 商品数量较少
            if(target.className=='sub'){
                let id=target.dataset.id-0
                let goods=this.list.find(item=>{
                    return item.goods_id==id
                })
                if(goods.cart_number==1){
                    return false
                }
                goods.cart_number--
                this.render()
            }
            // 删除功能
            if(target.className=='del'){
                let id=target.dataset.id-0
                let index=this.list.findIndex(item=>{
                    return item.goods_id==id
                })
                this.list.splice(index,1)
                this.render()
                 //如果数组的长度为0的话，就把全选的状态改成false
                 if(!this.list.length){
                    this.selectAll.checked=false
                 }
            }
            // 选中几个就删除几个
            if(target.className=='dlAll'){
                let res=this.list.filter(item=>{
                    return item.is_select==false
                })
                this.list=res
                this.render()
                if(!this.list.length){
                    this.selectAll.checked=false
                }
            }
        },false)
    }
    // 计算总数及总价
    total(){
        let num=0
        let price=0
        this.list.forEach(item=>{
            if(item.is_select==true){
                num+=item.cart_number
                price+=item.price*item.cart_number
            }
            let res = this.list.every(item=>{return item.is_select == true})
            if(res){
                this.selectAll.checked = true
            }else{
                this.selectAll.checked = false
            }
        })
        this.totalNum.innerHTML=num
        this.money.innerHTML=Math.round(price*100)/100
    }

}


new Cart()